﻿@using Top.Api.Response;
@using HuiJiYunGo.EF;
@{
    ViewBag.Title = "惠集云GO，优惠云集";
    Layout = "~/Views/Shared/_LayoutMobile.cshtml";
    //var ResultList = ViewBag.ResultList as List<TbkDgMaterialOptionalResponse.MapDataDomain>;
}


<style>
    .jq22-good-list a {
        background-color: rgba(239, 46, 46, 0.06);
        border-radius: 6px;
        margin-top: 10px;
        margin-left: 8px;
        margin-right: 8px;
    }

    .btn-buy {
        width: 5.6rem;
        height: 2.68rem;
        background: linear-gradient(90deg,#ff5d6a,#fb86ef) !important;
        box-shadow: 0 0.04rem 0.06rem 0 rgba(235,73,251,.25);
        border-radius: 2rem .04rem .04rem 2rem;
        position: absolute;
        bottom: .24rem;
        right: -.08rem;
        border: 1px solid transparent;
        z-index: 1;
        padding-left: .28rem;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
    }

    .tobuy {
        font-size: .24rem;
        font-family: PingFangSC-Medium,PingFang SC;
        font-weight: 500;
        color: #fff;
    }

    .btn-buy span {
        color: #ffffff;
        background-color: rgba(255, 255, 255, 0);
    }

        .btn-buy span:last-child {
            font-size: .24rem;
            font-family: PingFangSC-Medium,PingFang SC;
            font-weight: 500;
            color: #fff;
        }

    .jq22-flex-box h3 {
        font-size: 1.1rem;
    }

    .jq22-flex-box span {
        text-align: center;
        border-radius: 2px;
        font-size: 0.7rem;
        /*padding: 0.1rem 0.3rem;*/
    }
</style>


<section class="jq22-scrollView">
    @*<div class="jq22-ad-img">
            <img src="https://ossgw.alicdn.com/alp/1567876039229-750-330.png" alt="">
        </div>
        <div class="divHeight"></div>*@
    <div class="jq22-good-list">
        @*@foreach (var item in ResultList)
            {
                <a href="@item.CouponShareUrl " class="jq22-flex">
                    <div class="jq22-img-pd">
                        <img src="@item.PictUrl" alt="">
                    </div>
                    <div class="jq22-flex-box">
                        <h2>@item.Title</h2>
                        <span>@item.ItemDescription</span>
                        <h3>优惠价 @(decimal.Parse(item.ZkFinalPrice)- decimal.Parse(item.CouponAmount))</h3>
                        <p style="display: inline-block">领取 @(item.CouponAmount)元券</p>
                        <p style="display: inline-block;float: right;">销量 @(item.Volume)</p>
                    </div>
                </a>
                <div class="divHeight"></div>
            }*@
    </div>
    <div style="height:55px"></div>

</section>
@*<footer class="jq22-footer jq22-footer-fixed">
                <a href="javascript:;" class="jq22-tabBar-item">
                    <span class="jq22-tabBar-item-icon">
                        <i class="icon icon-home"></i>
                    </span>
                    <span class="jq22-tabBar-item-text">首页</span>
                </a>
                <a href="javascript:;" class="jq22-tabBar-item ">
                    <span class="jq22-tabBar-item-icon">
                        <i class="icon icon-news"></i>
                    </span>
                    <span class="jq22-tabBar-item-text">好价</span>
                </a>
                <a href="javascript:;" class="jq22-tabBar-item ">
                    <span class="jq22-tabBar-item-icon">
                        <i class="icon icon-pic"></i>
                    </span>
                    <span class="jq22-tabBar-item-text">社区</span>
                </a>
                <a href="javascript:;" class="jq22-tabBar-item ">
                    <span class="jq22-tabBar-item-icon">
                        <i class="icon icon-mine"></i>
                    </span>
                    <span class="jq22-tabBar-item-text">我的</span>
                </a>
            </footer>

        </section>
    </body>
    </html>*@
@*<script src="~/Scripts/Mobile/jquery.min.js"></script>
    <script src="~/Scripts/Mobile/layer.js"></script>
    <script src="~/Scripts/Mobile/slider.js"></script>*@
<script src="~/Scripts/Mobile/jquery.min.js"></script>
<script src="~/Scripts/template-web.js.js"></script>
<script type="text/html" id="tpl">
    {{each ResultList}}
    @*<li>
            {{$index}} ---- {{$value.Nick}}
        </li>*@
    <a href="/mobile/GoodsDetails?itemid={{$value.ItemId}}" class="jq22-flex">
        <div class="jq22-img-pd">
            <img src="{{$value.PictUrl}}" alt="">
        </div>
        <div class="jq22-flex-box">
            {{if($value.ShortTitle)}}
            <h2>{{$value.ShortTitle}}</h2>
            {{else}}
            <h2>{{$value.Title}}</h2>
            {{/if}}
            {{if($value.ItemDescription)}}
            <span>{{$value.ItemDescription}}</span>
            {{/if}}
            <h3>券后  ￥{{(($value.ZkFinalPrice-$value.CouponAmount)).toFixed(1)}}</h3>
            <p>可领取 {{$value.CouponAmount}} 元优惠券</p>
            <div class="btn-buy">
                <span class="tobuy">去购买</span>
                <span>{{$value.Volume}}已购</span>
            </div>
        </div>
    </a>
    {{/each}}
</script>
<script>
    $(function () {

        var page = 1;
        AjaxNPN(1);//加载默认第一页
        function AjaxNPN(page) {
            $.ajax({
                url: '/Mobile/AjaxNPN',
                type: 'POST',
                dataType: 'json',
                data: { Page: page },
                success: function (result) {
                    console.log(result);
                    var html = template('tpl', { ResultList: result.ResultList })
                    $(".jq22-good-list").append(html);
                },
                error: function (res) {
                    // 错误时处理逻辑
                }
            });
        }

        $('.jq22-scrollView').scroll(function () {
            var viewH = $(this).height(),//可见高度
                contentH = $(this).get(0).scrollHeight,//内容高度
                scrollTop = $(this).scrollTop();//滚动高度

            console.log(viewH + ',' + contentH + ',' + scrollTop);

            if (contentH - viewH - scrollTop == 0) {
                //$('.wrapper2-content').append("111111111111");
                page += 1;
                AjaxNPN(page);
            }
        });

    });
</script>